import express from 'express';
import cors from 'cors';
import bodyParser from 'body-parser';

const app = express();

// 使用中间件
app.use(cors());
app.use(bodyParser.json()); // 解析 JSON 格式的请求体
app.use(bodyParser.urlencoded({ extended: true })); // 解析 URL 编码的请求体

// get请求
app.get('/user', (req, res) => {
    let user = { name: '张三', age: 18 };
    res.json(user);
});

// post请求
app.post('/fruit', (req, res) => {
    let data = ['苹果', '香蕉', '橘子'];
    res.json(data);
});

// 查询歌曲
app.get("/songs", (req, res) => {
    let { id } = req.query;
    let datas = [
        { id: 2636746926, name: "不懂她", author: "伍六七" },
        { id: 2639639291, name: "不乱不破", author: "七八九" },
        { id: 11111, name: "两只老虎", author: "汪哥" },
    ];
    let result = datas.find(item => item.id === parseInt(id));
    res.json(result || {});
});

// 部门动态接口
app.get('/dept', (req, res) => {
    const data = [
        {
            image: 'https://www.jxvc.jx.cn/__local/F/C0/CC/797CAA6F4219A4BB0A09A7B1558_294892B8_1DB31.png',
            title: '漆彩飞扬，扇韵传承——文化旅游学院开展漆扇文化创意活动',
            date: '2024-09-18',
            detail: '9月14日上午，文化旅游学院联合校企合作单位——庐山嘉豪淮海国际豪生酒店，举办漆扇非遗文化创意活动。此次活动旨在弘扬中华优秀传统文化，使学生近距离感受传统文化的魅力，增进对传统文化的理解和热爱。漆扇是一种以扇子为载体，运用国家级非遗漆染工艺手工染制而成的艺术品。活动现场人头攒动，气氛热烈。在专业人员的讲解与指导下，同学们学习漆艺中的“飘漆”技法，利用漆不溶于水的特质，以点、甩、弹、划等手法，在水面'
        },
        {
            image: 'https://www.jxvc.jx.cn/__local/D/B4/2B/707D78F1103D5DC5E567BF740D6_F75E060D_223F0.png',
            title: '漆彩飞扬，扇韵传承——文化旅游学院开展漆扇文化创意活动',
            date: '2024-09-18',
            detail: '9月14日上午，文化旅游学院联合校企合作单位——庐山嘉豪淮海国际豪生酒店，举办漆扇非遗文化创意活动。此次活动旨在弘扬中华优秀传统文化，使学生近距离感受传统文化的魅力，增进对传统文化的理解和热爱。漆扇是一种以扇子为载体，运用国家级非遗漆染工艺手工染制而成的艺术品。活动现场人头攒动，气氛热烈。在专业人员的讲解与指导下，同学们学习漆艺中的“飘漆”技法，利用漆不溶于水的特质，以点、甩、弹、划等手法，在水面'
        }
    ];
    res.json({ data });
});

// 专栏动态接口
app.get('/column', (req, res) => {
    const data = [
        {
            image: 'https://www.jxvc.jx.cn/images/24/20204072001.jpg'
        },
        {
            image: 'https://www.jxvc.jx.cn/images/24/20204072001.jpg'
        },
        {
            image: 'https://www.jxvc.jx.cn/images/24/20204072001.jpg'
        },
        {
            image: 'https://www.jxvc.jx.cn/images/24/20204072001.jpg'
        },
        {
            image: 'https://www.jxvc.jx.cn/images/24/20204072001.jpg'
        },
        {
            image: 'https://www.jxvc.jx.cn/images/24/20204072001.jpg'
        },
    ];
    res.json({ data });
});

//选项卡切换接口

// 选项卡和内容的映射表
const tabs = [
    { title: 'HTML', content: 'HTML精品教程' },
    { title: 'JavaScript', content: 'JavaScript精品教程' },
    { title: 'Vue', content: 'Vue项目实战' }
  ];
  
  // 设置初始状态
  let status = {
      activeIndex: 0,  // 初始选中的选项卡索引
      selectedContent: tabs[0].content  // 初始选中的内容
  };
  
  // 获取当前选中的选项卡和内容
  app.get('/tab', (req, res) => {
      const activeTab = tabs[status.activeIndex];
      res.json({
          activeTab: activeTab.title,
          selectedContent: activeTab.content,
          tabs: tabs
      });
  });
  
  // 更新选中的选项卡和内容
  app.post('/tabs', (req, res) => {
      const newTabTitle = req.body.tab;  // 新的选项卡Title
  
      // 找到新选项卡的索引
      const newIndex = tabs.findIndex(tab => tab.title === newTabTitle);
  
      if (newIndex !== -1) {
          status.activeIndex = newIndex;  // 更新选中的选项卡索引
          status.selectedContent = tabs[newIndex].content;  // 更新选中的内容
          res.json({
              activeTab: newTabTitle,
              selectedContent: tabs[newIndex].content,
              tabs: tabs
          });
      } else {
          res.status(400).json({ error: '无效的选项卡' });
      }
  });


// // 选项卡切换
// // 设置初始状态
// let status = {
//     activeTab: 'HTML',
//     selectedContent: 'HTML精品教程'
// };

// // 选项卡和内容的映射表
// const tabContentMap = {
//     HTML: 'HTML精品教程',
//     JavaScript: 'JavaScript精品教程',
//     Vue: 'Vue项目实战'
// };

// // 获取当前选中的选项卡和内容
// app.get('/tab', (req, res) => {
//     res.json(status);
// });

// // 更新选中的选项卡和内容
// app.post('/tabs', (req, res) => {
//     const newTab = req.body.tab;  // 新的选项卡

//     //判断选项卡是否存在
//     if(tabContentMap[newTab]) {
//         status.activeTab = newTab;  // 更新选中的选项卡
//         status.selectedContent = tabContentMap[newTab];  // 更新选中的内容
//         res.json(status);  // 返回更新后的状态
//     } else {
//         res.status(400).json({ error: '无效的选项卡' });
//     }
// });

//

// 指定端口号，启动服务
app.listen(4000, () => {
    console.log('服务器启动成功，端口号为：4000');
});